<template>
	<view class="full-height">
		<!-- 按钮组 -->
		<veiw class="defect-tools" v-if="showType === showTypeButton">
			<button v-show="assignVisible" :size="size" @click="handleAssign" class="button cat2bug-button-assign">{{$t('assign')}}</button>
			<button v-show="repairVisible" :size="size" @click="handleRepair" class="button cat2bug-button-repair">{{$t('repair')}}</button>
			<button v-show="rejectVisible" :size="size" @click="handleReject" class="button cat2bug-button-reject">{{$t('reject')}}</button>
			<button v-show="passVisible" :size="size" @click="handlePass" class="button cat2bug-button-pass">{{$t('pass')}}</button>
			<button v-show="openVisible" :size="size" @click="handleOpen" class="button cat2bug-button-open">{{$t('open')}}</button>
			<button v-show="closeVisible" :size="size" @click="handleClose" class="button cat2bug-button-close">{{$t('close')}}</button>
			<button v-show="editVisible" :size="size" @click="handleEdit" class="button cat2bug-button-modify">{{ $t('modify') }}</button>
			<button v-show="deleteVisible" :size="size" @click="handleDelete" class="button cat2bug-button-delete">{{$t('delete')}}</button>
		</veiw>
		<!-- 悬浮按钮 -->
		<uni-fab v-else-if="showType === showTypeFab" 
			ref="fab" 
			:pattern="pattern" 
			:content="fabButtons" 
			horizontal="right" 
			vertical="bottom"
			direction="vertical" 
			@trigger="trigger" 
			@fabClick="fabClick" />
		<!-- 指派对话框 -->
		<assign-popup ref="assignPopup" @log="handleDefectLog"></assign-popup>
		<!-- 修复对话框 -->
		<repair-popup ref="repairPopup" @log="handleDefectLog"></repair-popup>
		<!-- 驳回对话框 -->
		<reject-popup ref="rejectPopup" @log="handleDefectLog"></reject-popup>
		<!-- 通过对话框 -->
		<pass-popup ref="passPopup" @log="handleDefectLog"></pass-popup>
		<!-- 开启对话框 -->
		<open-popup ref="openPopup" @log="handleDefectLog"></open-popup>
		<!-- 关闭对话框 -->
		<close-popup ref="closePopup" @log="handleDefectLog"></close-popup>
		<!-- 修改对话框 -->
		<modify-popup ref="modifyPopup" @log="handleDefectLog"></modify-popup>
	</view>
</template>

<script>
	import { getDefect } from "@/api/system/defect.js"
	import {checkPermi} from "@/utils/permission";
	import AssignPopup from "./assign-popup.vue"
	import RepairPopup from "./repair-popup.vue"
	import RejectPopup from "./reject-popup.vue"
	import PassPopup from "./pass-popup.vue"
	import OpenPopup from "./open-popup.vue"
	import ClosePopup from "./close-popup.vue"
	import ModifyPopup from "./modify-popup.vue"
	import { PROCESSING_STATE, AUDIT_STATE, RESOLVED_STATE, REJECTED_STATE, CLOSE_STATE,
		checkAssignPermi, checkRepairPermi, checkRejectPermi, checkPassPermi, checkClosePermi, checkOpenPermi, checkDeletePermi, checkEditPermi
	} from "@/utils/defect.js"
	/** 显示按钮类型 */
	const SHOW_TYPE_BUTTON = 'button';
	/** 显示悬浮类型 */
	const SHOW_TYPE_FAB = 'fab';
	
	export default {
		name: 'DefectTools',
		components: { AssignPopup, RepairPopup, RejectPopup, PassPopup, OpenPopup, ClosePopup, ModifyPopup },
		model: {
		    prop: 'value',
		    event: 'input'
		},
		data() {
			return {
				showTypeButton: SHOW_TYPE_BUTTON,
				showTypeFab: SHOW_TYPE_FAB,
				title: 'uni-fab',
				directionStr: '垂直',
				pattern: {
					color: '#7A7E83',
					backgroundColor: '#fff',
					selectedColor: '#007AFF',
					buttonColor: '#007AFF',
					iconColor: '#fff'
				},
				is_color_type: false,
			}
		},
		props: {
			/** 显示的类型，button：按钮；fab：悬浮 */
			showType: {
				type: String,
				validator: value => [SHOW_TYPE_BUTTON, SHOW_TYPE_FAB].includes(value),
				default: SHOW_TYPE_BUTTON
			},
			exclusions: {
			  type: Array,
			  default: ()=>[]
			},
			value: {
			  type: Object,
			  default: {
					  defectId: 2
				  }
			},
			isText: {
			  type: Boolean,
			  default: null
			},
			isShowIcon: {
			  type: Boolean,
			  default: null
			},
			size: {
			  type: String,
			  default: 'default'
			}
		},
		computed: {
			fabButtons() {
				let buttons = [];
				if(this.assignVisible) {
					buttons.push({
						iconPath: '/static/images/system/defect/assign.png',
						selectedIconPath: '/static/images/system/defect/assign_.png',
						text: this.$i18n.t('assign'),
						active: false
					});
				}
				if(this.repairVisible) {
					buttons.push({
						iconPath: '/static/images/system/defect/repair.png',
						selectedIconPath: '/static/images/system/defect/repair_.png',
						text: this.$i18n.t('repair'),
						active: false
					});
				}
				if(this.rejectVisible) {
					buttons.push({
						iconPath: '/static/images/system/defect/reject.png',
						selectedIconPath: '/static/images/system/defect/reject_.png',
						text: this.$i18n.t('reject'),
						active: false
					});
				}
				if(this.passVisible) {
					buttons.push({
						iconPath: '/static/images/system/defect/pass.png',
						selectedIconPath: '/static/images/system/defect/pass_.png',
						text: this.$i18n.t('pass'),
						active: false
					});
				}
				if(this.openVisible) {
					buttons.push({
						iconPath: '/static/images/system/defect/open.png',
						selectedIconPath: '/static/images/system/defect/open_.png',
						text: this.$i18n.t('open'),
						active: false
					});
				}
				if(this.closeVisible) {
					buttons.push({
						iconPath: '/static/images/system/defect/close.png',
						selectedIconPath: '/static/images/system/defect/close_.png',
						text: this.$i18n.t('close'),
						active: false
					});
				}
				if(this.editVisible) {
					buttons.push({
						iconPath: '/static/images/common/modify.png',
						selectedIconPath: '/static/images/common/modify_.png',
						text: this.$i18n.t('modify'),
						active: false
					});
				}
				if(this.deleteVisible) {
					buttons.push({
						iconPath: '/static/images/common/delete.png',
						selectedIconPath: '/static/images/common/delete_.png',
						text: this.$i18n.t('delete'),
						active: false
					});
				}
				return buttons;
			},
		    /** 获取当前用户id */
		    currentUserId: function() {
		        return this.$store.state.user.id;
		    },
		    // 指派
		    assignVisible: function () {
				return checkAssignPermi(this.value, this.currentUserId);
		    },
		    // 修复
		    repairVisible: function () {
				return checkRepairPermi(this.value, this.currentUserId);
		    },
		    // 驳回
		    rejectVisible: function () {
				return checkRejectPermi(this.value, this.currentUserId);
		    },
		    // 通过
		    passVisible: function () {
				return checkPassPermi(this.value, this.currentUserId);
		    },
		    // 关闭
		    closeVisible: function () {
				return checkClosePermi(this.value);
		    },
		    // 开启
		    openVisible: function () {
				return checkOpenPermi(this.value);
		    },
		    deleteVisible: function () {
				return checkDeletePermi(this.value, this.currentUserId);
		    },
		    editVisible: function () {
		        return checkEditPermi(this.value, this.currentUserId);
		    },
		  },
		  methods:{
			trigger(e) {
				switch(e.item.text) {
					case this.$i18n.t('assign'):
						this.handleAssign();
						break;
					case this.$i18n.t('repair'):
						this.handleRepair();
						break;
					case this.$i18n.t('reject'):
						this.handleReject();
						break;
					case this.$i18n.t('pass'):
						this.handlePass();
						break;
					case this.$i18n.t('open'):
						this.handleOpen();
						break;
					case this.$i18n.t('close'):
						this.handleClose();
						break;
					case this.$i18n.t('modify'):
						this.handleEdit();
						break;
					case this.$i18n.t('delete'):
						this.handleDelete();
						break;
				}
			},
			fabClick() {},
		    /** 处理指派缺陷 */
		    handleAssign(event){
		    	this.$refs.assignPopup.open(this.value);
		    },
		    /** 处理驳回缺陷 */
		    handleReject(event) {
		      this.$refs.rejectPopup.open(this.value);
		    },
		    /** 处理修复缺陷 */
		    handleRepair(event) {
		      this.$refs.repairPopup.open(this.value);
		    },
		    /** 处理通过缺陷 */
		    handlePass(event) {
		      this.$refs.passPopup.open(this.value);
		    },
		    handleClose(event){
		      this.$refs.closePopup.open(this.value);
		    },
		    handleOpen(event){
		      this.$refs.openPopup.open(this.value);
		    },
		    /** 打开编辑窗体 */
		    handleEdit(event) {
		      this.$refs.modifyPopup.open(this.value);
		    },
		    logHandle(log) {
		      this.$emit('log',log);
		    },
		    /** 点击收藏操作 */
		    clickCollectHandle(collect, defect,isRefreshList) {
		      // 保存收藏状态
		      updateUserDefect(defect.defectId, {
		        defectId: defect.defectId,
		        userId: this.currentUserId,
		        collect: collect?1:0
		      }).then(res=>{
		        this.$set(defect, 'collect', collect);
		        // 如果collect参数存在，表明是点击头部的收藏按钮触发
		        if(isRefreshList) {
		          this.$emit('update',this.value);
		        }
		        if(collect) {
		          this.$message.success(this.$t('collect-success').toString());
		        } else {
		          this.$message.success(this.$t('cancel-success').toString());
		        }
		      });
		    },
		    /** 删除按钮操作 */
		    handleDelete(event) {
		      const defectIds = this.value.defectId;
		      this.$modal.confirm(
		        this.$t('defect.delete-defect'),
		        this.$t('prompted').toString(),
		        {
		          confirmButtonText: this.i18n.t('delete').toString(),
		          cancelButtonText: this.i18n.t('cancel').toString(),
		          confirmButtonClass: 'delete-button',
		          type: "warning"
		        }).then(function() {
		        return delDefect(defectIds);
		      }).then(() => {
		        this.$emit('delete',this.value);
		        this.$modal.msgSuccess(this.$t('delete.success'));
		      }).catch(() => {});
		      event.stopPropagation();
		    },
			/** 处理缺陷日志事件 */
			handleDefectLog(log) {
				// 刷新缺陷信息
				getDefect(this.value.defectId).then(res=>{
					this.$emit('input', res.data);
				});
			}
		}
	}
</script>

<style lang="scss">
	.defect-tools {
		display: inline-flex;
		flex-direction: row;
		flex-wrap: wrap;
		max-width: 100vw;
		height: 100%;
		> .button {
			height: 100%;
			border-radius: 0 !important;  
			border-width: 0 !important;
			display: inline-flex;
			justify-content: center;
			align-items: center;
		}
	}
</style>